<%-- 
    Document   : login
    Created on : Jun 24, 2013, 11:33:38 PM
    Author     : zeor
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Login1</title>
        <style type="text/css">

            #authform {
                background: none repeat scroll 0 0 #FFFFFF;
                border: 3px solid #C9C9C9;
                border-radius: 8px;
                color: #525252;
                font-family: Arial;
                height: 190px;
                margin: 100px auto;
                padding: 5px 0 30px 20px;
                position: relative;
                width: 300px;
                text-align: center;
            }
            #authform label {
                display: block;
                float: left;
                font-size: 13px;
                margin-top: 5px;
                width: 80px;
            }
            #authform div {
                margin-bottom: 18px;
            }

            #authform h1 {
                font-size: 18px;
                font-weight: bold;
                margin-bottom: 26px;
                text-transform: uppercase;
                text-shadow:  0 1px rgba(255,255,255,0.3);
                margin-left: -10px;
            }
            #authform a {
                text-decoration: none;
            }
            #authform a[link-to-registration] {
                color: #525252;
                display: block;
                font-size: 14px;
                font-weight: bold;
                text-transform: uppercase;
                margin-right: 15px;
            }
            #authform a[link-to-registration]:hover {
                color: #A9A9A9;
            }
            #authform form input[type="submit"]:hover {
                color: #A9A9A9;
            }
            #authform form input[type="submit"] {
                background: linear-gradient(to bottom, #FFFFFF 0%, #F1F1F1 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
                border: 1px solid #C9C9C9;
                border-radius: 8px;
                color: #525252;
                font-size: 16px;
                font-weight: 400;
                left: 25%;
                margin-top: -45px;
                padding: 4px 10px;
                position: absolute;
                cursor: pointer;
            }
            #authform form input[type="text"], input[type="password"] {
                border: 1px solid #C9C9C9;
                border-radius: 5px;
                /*box-shadow: 0 0 2px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 3px rgba(255, 255, 255, 0.4);*/
                color: #535353;
                font-size: 14px;
                padding: 6px;
                width: 60%;
            }
            #authform a[link-to-list-study] {
                color: #525252;
                display: block;
                font-size: 12px;
                margin-top: -4px;
                position: absolute;
                right: 45px;
            }
            #authform a[link-to-list-study]:hover {
                color: #C2C2D6;
            }
            #authform div > input[type="submit"] {
                margin-top: 20px;
            }

        </style>
    </head>
    <body>        
        <div id="authform">
            <h1>Login</h1>
            <form action="<c:url value="/auth/login"/>" method="POST">
                <div>
                    <label for="userName">User name</label>
                    <input type="text" name="userName" id="userName" placeholder="user name" value=""/>
                </div>
                <div>
                    <label for="userPassword">Password</label>
                    <input type="password" name="userPassword" id="userPassword"  placeholder="password" value=""/>
                </div>
                <div>
                    <input type="submit" value="login">
                </div>
            </form>
            <div style="float:right;padding-right: 30px;">
                <!--a href="<c:url value="/index/listStudy"/>" link-to-list-study>Study list</a-->
                <a href="<c:url value="/registerUser?new"/>" link-to-registration>Sign up</a>
            </div>
        </div>
            
    </body>
</html>
